<template>
	<view class="quanb">
		<view class="tou">
			<view class="beij">
				<image src="http://img.caocaog.com/ztwm/6536_1728715816997.png" mode=""></image>
			</view>
			<view class="ner">
				<view class="keiti" @click="dianji">
					修改信息
				</view>
				<view class="neir">
					<view class="zeif myt">
						<view class="title">
							账户类：
						</view>
						<view class="name">
							支付宝
						</view>
					</view>
					<view class="zeif zj">
						<view class="title">
							姓名：
						</view>
						<view class="name">
							{{userName||'暂未设置'}}
						</view>
					</view>
					<view class="zeif">
						<view class="title">
							账号：
						</view>
						<view class="name">
							{{phone||'暂未设置'}}
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>

	<view class="danchu" v-if="shou">
		<view class="zhognija">

			<view class="inut">
				<view class="ii">
				</view>
				<input class="in" type="text" placeholder="请输入提现人姓名" v-model="aliName" />
			</view>
			<view class="inut">
				<input class="in" type="text" placeholder="请输入提现账号" v-model="aliAccount " />
			</view>
			<view class="anniu">
				<view class="qui" @click="dian">
					取消
				</view>
				<view class="que" @click="diana">
					确认
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		onlineInfo,
		modifyTakeInfo,
		memberInfo,
	} from "../../request/api.js"
	export default {
		data() {
			return {
				shou: false,
				userInfo: null,
				aliAccount: '',
				aliName: '',
				userName: '',
				phone: '',
				hide: '',
				personalinformation: {}
			}
		},
		onLoad() {

		},
		onShow() {
			this.memberInfo()
			this.userInfo = uni.getStorageSync('userInfo')

		},
		methods: {
			memberInfo() {
				memberInfo({
					id: uni.getStorageSync('userInfo').id
				}).then(res => {
					this.userName = res.result.alipayName
					this.phone = res.result.alipayAccount
					this.personalinformation = res.result
				})
			},
			onlineInfo() {
				onlineInfo().then(res => {
					console.log(res, '个人信息');
					uni.setStorageSync('userInfo', res.result);
					this.userInfo = uni.getStorageSync('userInfo')
				})
			},
			modifyTakeInfo() {
				modifyTakeInfo({
					alipayAccount: this.aliAccount,
					alipayName: this.aliName,
					id: uni.getStorageSync('userInfo').id
				}).then(res => {
					console.log(res, uni.getStorageSync('userInfo').id, '成功');
					// this.onlineInfo()
					this.memberInfo()
				})
			},
			dianji() {
				this.shou = true
			},
			dian() {
				this.shou = false
			},
			diana() {
				this.modifyTakeInfo()

				this.shou = false
			}


		},
	}
</script>

<style scoped lang="less">
	.tou {
		position: relative;
		width: 702rpx;

		border-radius: 16rpx;
		margin: 0 auto;
		margin-top: 56rpx;
		padding-left: 42rpx;
		padding-top: 27rpx;
		padding-right: 29rpx;
		box-sizing: border-box;

		.beij {
			position: absolute;
			top: 0;
			left: 0;
			z-index: -9;
			width: 702rpx;


			image {
				width: 702rpx;

			}
		}

		.ner {
			.keiti {
				text-align: right;
				font-family: HarmonyOS Sans SC, HarmonyOS Sans SC;
				font-weight: 400;
				font-size: 26rpx;
				color: #FFFFFF;

				font-style: normal;
				text-transform: none;
			}

			.neir {
				.zeif {
					display: flex;

					.title {
						font-family: HarmonyOS Sans SC, HarmonyOS Sans SC;
						font-weight: 400;
						font-size: 28rpx;
						color: #FFFFFF;

						font-style: normal;
						text-transform: none;
						opacity: 0.6;
					}

					.name {
						font-family: HarmonyOS Sans SC, HarmonyOS Sans SC;
						font-weight: 400;
						font-size: 32rpx;
						color: #FFFFFF;


						font-style: normal;
						text-transform: none;
					}
				}

				.zj {
					margin-top: 33rpx;
					margin-bottom: 33rpx;
				}

				.myt {
					margin-top: 19rpx;

				}
			}
		}
	}

	.danchu {
		position: absolute;
		top: 0;

		width: 100vw;
		height: 100vh;
		background: rgba(0, 0, 0, 0.2);

		.zhognija {
			width: 602rpx;

			background: #FFFFFF;
			margin: 0 auto;
			margin-top: 300rpx;
			border-radius: 16rpx;
			padding-top: 30rpx;


			.inut {
				width: 500rpx;
				height: 100rpx;
				background: #d9d9d9;
				margin: 0 auto;
				margin-top: 10rpx;
				border-radius: 50rpx;
				padding-left: 50rpx;
				padding-right: 20rpx;
				box-sizing: border-box;

				input {
					height: 100rpx;
				}
			}
		}

		.anniu {
			display: flex;
			margin-top: 30rpx;
			border-top: 1rpx solid #d6d1d6;

			.qui {
				width: 50%;
				height: 100rpx;
				border-right: 1rpx solid #d6d1d6;
				text-align: center;
				line-height: 100rpx;
			}

			.que {
				width: 50%;
				height: 100rpx;
				text-align: center;
				line-height: 100rpx;
			}
		}
	}
</style>